import React, { PureComponent, createContext, forwardRef } from 'react'

export default class Test extends PureComponent {
  render() {
    return (
      <>
        <div>Test</div>
        <button onClick={() => this.showRef()}>打印ref</button>
        <hr />
        <Home ref={ref => (this.HomeRef = ref)}></Home>
        <hr />
        <About></About>
        <hr />
        <ForwardRefSchool ref={ref => (this.SchoolRef = ref)}></ForwardRefSchool>
      </>
    )
  }
  showRef() {
    console.log(this.HomeRef)
    console.log(this.SchoolRef)
  }
}

class Home extends PureComponent {
  render() {
    return (
      <>
        <div>Home</div>
      </>
    )
  }
}
function About(props) {
  return (
    <>
      <div>About</div>
    </>
  )
}
const ForwardRefSchool = forwardRef(function (props, ref) {
  return (
    <>
      <div ref={ref}>School</div>
    </>
  )
})
